<template>
	<view class="detail-view">
		<view class="top-bar"><uni-navbar :fixed="true" :back="true" color="#fff" :title="title"></uni-navbar></view>

		<view class="detail-info" v-show="perform.id">
			<view class="info-title">
				<view class="title-top">{{ perform.title }}</view>
				<view class="title-btm">
					<text class="btm-time">{{ perform.createTime | parseTime('{y}-{m}-{d}') }}</text>
				</view>
			</view>
			<view class="info-detail">
				<view class="overflow"><uni-parse :content="perform.content"></uni-parse></view>
			</view>
		</view>

		<view class="file-list" v-if="imageList.length > 0">
			<view>图片:</view>
			<view class="file-item" v-for="(item, index) in imageList" :key="index" @click="$showLine(item)">
				<view class="file-name clamp">{{ item.name }}</view>
				<view class="right-type">预览</view>
			</view>
		</view>

		<view class="file-list" v-if="fileList.length > 0">
			<view>附件:</view>
			<view class="file-item" v-for="(item, index) in fileList" :key="index" @click="$showLine(item)">
				<view class="file-name clamp">{{ item.name }}</view>
				<view class="right-type">预览</view>
			</view>
		</view>

		<view class="form-box form-box-show">
			<u-form ref="uForm">
				<!-- 类型 -->
				<block v-if="['2'].indexOf(module) == -1">
					<block v-if="perform.type">
						<u-form-item class="form-item" label="类型" labelAlign="left" label-width="190">{{ typeList[perform.type] }}</u-form-item>
					</block>
				</block>
				<!-- 类型联动 -->
				<block v-if="['2'].indexOf(module) != -1">
					<u-form-item class="form-item" label="组织类型" labelAlign="left" label-width="190">{{ typeList[perform.type] }}</u-form-item>
					<u-form-item class="form-item" label="活动类型" labelAlign="left" label-width="190" :key="secType">{{ secTypeList[perform.secType] }}</u-form-item>
				</block>
				<!-- 发言类型 -->
				<block v-if="['3'].indexOf(module) != -1">
					<u-form-item class="form-item" label="发言类型" labelAlign="left" label-width="190">
						<u-checkbox-group>
							<u-checkbox v-model="item.checked" :disabled="item.disabled" v-for="(item, index) in mulList3" :key="index" :name="item.name">{{ item.name }}</u-checkbox>
						</u-checkbox-group>
					</u-form-item>
				</block>
				<!-- 采用情况 -->
				<block v-if="['5'].indexOf(module) != -1">
					<u-form-item class="form-item" label="采用" labelAlign="left" label-width="190">
						<u-checkbox-group>
							<u-checkbox v-model="item.checked" :disabled="item.disabled" v-for="(item, index) in mulList5" :key="index" :name="item.name">{{ item.name }}</u-checkbox>
						</u-checkbox-group>
					</u-form-item>
				</block>
				<!-- 批示情况 -->
				<block v-if="['12'].indexOf(module) != -1">
					<u-form-item class="form-item" label="批示" labelAlign="left" label-width="190">
						<u-checkbox-group>
							<u-checkbox v-model="item.checked" :disabled="item.disabled" v-for="(item, index) in mulList12" :key="index" :name="item.name">{{ item.name }}</u-checkbox>
						</u-checkbox-group>
					</u-form-item>
				</block>
				<!-- 日期 -->
				<block v-if="['0'].indexOf(module) == -1">
					<u-form-item class="form-item" label="履职日期" labelAlign="left" label-width="190">{{ perform.createTime }}</u-form-item>
				</block>
				<!-- 代表团 -->
				<block v-if="['1', '2', '3', '5', '10', '11', '12'].indexOf(module) != -1">
					<u-form-item class="form-item" label="代表团" labelAlign="left" label-width="190">{{ perform.wyhdzName }}</u-form-item>
				</block>
				<!-- 履职代表 -->
				<block v-if="['1', '2', '10'].indexOf(module) == -1">
					<u-form-item class="form-item" label="代表" labelAlign="left" label-width="190" v-if="cjList.length > 0">
						<block v-for="(item, index) in cjList" :key="item.id">{{ item.userName }}{{ index == cjList.length - 1 ? '' : ',' }}</block>
					</u-form-item>
				</block>
				<!-- 代表 -->
				<block v-if="['1', '2', '10'].indexOf(module) != -1">
					<u-form-item class="form-item" label="参加代表" labelAlign="left" label-width="190" v-if="cjList.length > 0">
						<block v-for="(item, index) in cjList" :key="item.id">{{ item.userName }}{{ index == cjList.length - 1 ? '' : ',' }}</block>
					</u-form-item>
					<u-form-item class="form-item" label="迟到代表" labelAlign="left" label-width="190" v-if="cdList.length > 0">
						<block v-for="(item, index) in cdList" :key="item.id">{{ item.userName }}{{ index == cdList.length - 1 ? '' : ',' }}</block>
					</u-form-item>
					<u-form-item class="form-item" label="请假代表" labelAlign="left" label-width="190" v-if="qjList.length > 0">
						<block v-for="(item, index) in qjList" :key="item.id">{{ item.userName }}{{ index == qjList.length - 1 ? '' : ',' }}</block>
					</u-form-item>
					<u-form-item class="form-item" label="早退代表" labelAlign="left" label-width="190" v-if="ztList.length > 0">
						<block v-for="(item, index) in ztList" :key="item.id">{{ item.userName }}{{ index == ztList.length - 1 ? '' : ',' }}</block>
					</u-form-item>
					<u-form-item class="form-item" label="缺席代表" labelAlign="left" label-width="190" v-if="qxList.length > 0">
						<block v-for="(item, index) in qxList" :key="item.id">{{ item.userName }}{{ index == qxList.length - 1 ? '' : ',' }}</block>
					</u-form-item>
				</block>
			</u-form>

			<u-form ref="uForm" v-if="approveList.length > 0">
				<block v-for="(item, index) in approveList" :key="item.id">
					<u-form-item class="form-item" :label="item.nodeName + '人员'" labelAlign="left" label-width="190">{{ item.approveUserName }}</u-form-item>
					<u-form-item class="form-item" :label="item.nodeName + '时间'" labelAlign="left" label-width="190">{{ item.approveTime }}</u-form-item>
					<u-form-item class="form-item" :label="item.nodeName + '结果'" labelAlign="left" label-width="190">{{ item.approveFlag == 1 ? '通过' : '不通过' }}</u-form-item>
					<u-form-item class="form-item" :label="item.nodeName + '意见'" labelAlign="left" label-width="190">{{ item.approveIdea }}</u-form-item>
				</block>
			</u-form>

			<!-- <view class="fiexd-btm" v-if="$sysBtns(flag + '_edit') && perform.nodeStatus == '1'"><u-button class="form-btn" type="error" @click="editTo">修改</u-button></view> -->

			<view v-if="false && module && flag"></view>
		</view>
	</view>
</template>

<script>
import uniParse from '@/components/uni-parse/parse.vue';
import { mapState } from 'vuex';
export default {
	components: {
		uniParse
	},
	data() {
		return {
			typeList: [],
			secType: 0,
			secTypeList: [],
			mulList3: [],
			mulList5: [
				{
					name: '全国采用',
					checked: false,
					disabled: true
				},
				{
					name: '省级采用',
					checked: false,
					disabled: true
				},
				{
					name: '市级采用',
					checked: false,
					disabled: true
				}
			],
			mulList12: [
				{
					name: '中央领导批示',
					checked: false,
					disabled: true
				},
				{
					name: '省领导批示',
					checked: false,
					disabled: true
				},
				{
					name: '市领导批示',
					checked: false,
					disabled: true
				}
			],
			imageList: [],
			fileList: [],
			id: '',
			title: '人大会议',
			key: '会议',
			flag: 'zxhy',
			module: '1',
			organizeDeptList: [],
			cjList: [],
			cdList: [],
			ztList: [],
			qjList: [],
			qxList: [],
			approveList: [],
			perform: {}
		};
	},
	onLoad(option) {
		this.loadLogin();
		this.id = option.id;
		this.module = option.code;
		this.flag = option.flag;
		this.title = option.name;
		switch (option.code) {
			case '1':
				this.key = '会议';
				break;
			case '2':
				this.key = '活动';
				break;
			case '3':
				this.key = '发言';
				break;
			case '5':
				this.key = '';
				break;
			case '11':
				this.key = '活动';
				break;
			case '12':
				this.key = '发表';
				break;
			default:
				this.key = '履职';
		}

		uni.setNavigationBarTitle({
			title: this.title
		});
		this.loadDict('perform_' + this.module + '_type', 'typeList');
		this.loadCheck('perform_3_type', 'mulList3');
		this.loadData();
	},
	computed: {
		...mapState(['userInfo'])
	},
	methods: {
		loadLogin() {
			if (this.userInfo.sysUser) {
				this.userId = this.userInfo.sysUser.id;
				this.clientCode = this.userInfo.sysUser.clientCode;
			} else {
				this.$logout();
			}
		},
		loadDict(type, list) {
			this.$request('/system/sys-dict/dictList', {
				clientCode: this.clientCode,
				sysDict: {
					dictType: type
				}
			}).then((res) => {
				if (!res.data) {
					return false;
				}
				res.data.forEach((item) => {
					this[list][item.dictValue] = item.dictName;
				});
				if (list == 'secTypeList') {
					this.secType--;
				}
			});
		},
		loadCheck(type, list) {
			this.$request('/system/sys-dict/dictList', {
				clientCode: this.clientCode,
				sysDict: {
					dictType: type
				}
			}).then((res) => {
				if (!res.data) {
					return false;
				}
				res.data.forEach((item) => {
					this[list].push({
						name: item.dictName,
						checked: false,
						disabled: true
					});
				});
			});
		},
		async loadData() {
			await this.$request('/perform/query/' + this.id).then((res) => {
				this.imageList = res.data.imageList;
				this.fileList = res.data.fileList;
				this.perform = res.data.perform;
				this.organizeDeptList = res.data.organizeDeptList;
				this.cjList = res.data.cjList;
				this.cdList = res.data.cdList;
				this.ztList = res.data.ztList;
				this.qjList = res.data.qjList;
				this.qxList = res.data.qxList;
				this.approveList = res.data.approveList;
			});

			if (this.module == '2') {
				this.loadDict('perform_2_' + this.perform.type + '_sectype', 'secTypeList');
			}
			if (['3', '5', '12'].indexOf(this.module) != -1) {
				let mulCheck = this.perform.mulCheck.split(',');
				mulCheck.forEach((item) => {
					if (parseInt(item) > 0 && this['mulList' + this.module].length > 0) {
						this['mulList' + this.module][parseInt(item) - 1].checked = true;
					}
				});
			}
		},
		editTo() {
			uni.navigateTo({
				url: '/pagesA/duties/add?flag=' + this.flag + '&code=' + this.perform.module + '&name=' + this.title + '&id=' + this.id
			});
		}
	}
};
</script>

<style lang="scss">
.detail-view {
	background-color: #fff;
}

.form-box {
	border-top: 20rpx solid #f5f7fa;

	.form-item {
		@include mp-flex;
	}
}

.fiexd-btm {
	position: static;
	border-top: 20rpx solid #f5f7fa;
	padding: 30rpx;
}
</style>
